/*
 * @Author: error: git config user.name && git config user.email & please set dead value or install git
 * @Date: 2022-08-11 14:03:59
 * @LastEditors: error: git config user.name && git config user.email & please set dead value or install git
 * @LastEditTime: 2022-08-23 16:05:10
 * @FilePath: \施航4阶段react\src\components\Customertype.jsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import { Table, DatePicker, Space, Button, Input, } from 'antd';
import React, { useLayoutEffect, useState } from 'react';
import '../assets/css/Cstomertype.css'
import { useNavigate } from 'react-router-dom'
import axios from 'axios';
const dateFormat = 'YYYY/MM/DD';
const { RangePicker } = DatePicker;
const columns = [
    {
        title: '客户名称',
        dataIndex: 'clientName',
        align: 'center',
    },
    {
        title: '客户类型',
        dataIndex: 'clientTypeId',
        align: 'center',
    },
    {
        title: '联系人',
        dataIndex: 'clientContactsName',
        align: 'center',
    },
    {
        title: '手机号',
        dataIndex: 'clientContactsTel',
        align: 'center',
    },
    {
        title: '地址',
        dataIndex: 'clientAddress',
        align: 'center',
    },
    {
        title: '创建人',
        dataIndex: 'clientEmpId',
        align: 'center',
    },
    {
        title: '负责人',
        dataIndex: 'clientEmpId',
        align: 'center',
    },
    {
        title: '创建时间',
        className: dateFormat,
        dataIndex: 'clientUploadTime',
        align: 'center',
    },
    {
        title: '操作',
        render: (_, item) => {
            console.log(item);
            return <Space><Button type="primary">编辑</Button>
                <Button danger>删除</Button></Space>
        },
        align: 'center',
    },
];




const CustomerInformation = () => {
    const [tablelist, setNoteList] = useState();
    const pageSize = 20;
    const currentPage = 1;
    const [tb, setNo] = useState();
    const [ta, setNo2] = useState();
    useLayoutEffect(() => {
        Inquire();
    }, []);


    const handelChange = (e) => {
        setNo(e.target.value);
        console.log(e.target.value, tb);
    }

    const handelChanges = (e) => {
        setNo2(e.target.value)
        console.log(e.target.value, ta);
    }
    const Inquire = () => {
        axios({
            method: "get",
            url: "http://localhost:3000/sys/clientManager/queryClientByCondition",
            headers: {

            }, params: {
                pageSize: pageSize,
                currentPage: currentPage,
                client_end_time: "",
                client_contacts_tel: ta,
                client_start_time: "",
                condition_name: tb,
            }
        }).then((res) => {
            console.log(res);
            setNoteList([...res.data.data]);
        });
    }
    const select = () => {
        axios({
            method: "post",
            url: "http://localhost:3000/",
            headers: {

            }, params: {
                pageSize: pageSize,
                currentPage: currentPage,
                supplier_contacts_name: tb,
                supplier_name: tb,
            }
        }).then((res) => {
            console.log(res);
            setNoteList([...res.data.data]);
        });
    }
    const navigate = useNavigate();
    function clickCityHandle() {
        navigate('/home/7/tjkh')
    }

    return (<>
        <div className='Lists'>
            <div> 客户管理</div>
            <Button type="primary">刷新</Button>
        </div>
        <div className='Inquire'>
            <div> 筛选查询</div>
            <Button type="primary" onClick={select}>查询结果</Button>
        </div>
        <div className='Inquires'>
            <div>输入搜索:&nbsp;&nbsp;<Input placeholder="客户名称 联系人 创建人 负责人" onChange={handelChange} value={tb} /></div>
            <div>手机号:&nbsp;&nbsp;<Input placeholder="手机号" onChange={handelChanges} value={ta} /></div>
            <div>创建时间&nbsp;&nbsp;
                <Space direction="vertical" size={12}>
                    <RangePicker showTime format={dateFormat} />
                </Space>
            </div>
        </div>
        <div className='List'>
            <div>客户列表</div>
            <div>
                <Button type="primary" onClick={clickCityHandle}>添加</Button>
                {/* <Button type="primary">显示条数</Button>
                <Button type="primary">排序方式</Button> */}
            </div>
        </div>
        <Table
            rowKey="clientId"
            className='Tables'
            columns={columns}
            dataSource={tablelist}
            bordered
        />


    </>
    )
};

export default CustomerInformation;